.height(@w:50px) {
  height: @w;
}

@oracol: #ff8400;
@whicol: #fff;
@grecol: #e3e5e9;

.border4 {
  border: 1px solid #e3e5e9;
}

.bg {
  background: #fff;
}

.fs(@fs:12px) {
  font-size: @fs;
}

.pad4(@pd:20px) {
  padding: @pd;
}

.magbot(@mb:20px) {
  margin-bottom: @mb;
}

.magtop(@mb:20px) {
  margin-top: @mb;
}

.maglt(@mb:20px) {
  margin-left: @mb;
}

.magrt(@mb:20px) {
  margin-right: @mb;
}

.display(@dis:block) {
  display: @dis;
}

.float(@f:left) {
  float: left;
}

.clearfix {
  &:after {
    content: "";
    display: block;
    clear: both;
  }
}

.radius(@r:5px) {
  border-radius: @r;
}

//����
.infocap {
  .height(57px);
  line-height: 55px;
  border-top: 2px solid @oracol;
  background: @whicol;
  padding-left: 20px;
  .fs(15px);
  color: @oracol;
  .magbot();
}

.info1 {
  .height(35px);
  line-height: 30px;
  background: @whicol;
  border-bottom: 1px solid @grecol;
  text-indent: 5px;
}

form {

  span {
    color: @oracol;
    .fs(15px);
    .magrt(5px);
  }
  label {
    .display();
    width: 30%;
    text-align: right;
    .float();
    .magrt(10px);
  }
  li {
    .magbot();
    line-height: 2;
    .clearfix;

  }
  .sameinput {
    .height(35px);
    .float();
  }
  .col-20 {
    width: 20%;

  }
  .col-40 {
    width: 40%;
  }
  .mar {
    .magrt(5px);
  }
  input {
    .border4;
    .pad4(5px);
  }
  ul {
    padding: 40px 0;
    .fs(13px);

  }
  .keep {
    width: 300px;
    .height(35px);
    background: @oracol;
    .radius();
    color: @whicol;
    text-align: center;
    .fs(14px);
    margin: 0 auto;
    .display();
  }
}

.form1 {
  .height(440px);
  background: @whicol;
  .border4;
  .pad4(15px);
  .magbot();
  ul p {
    width: 60%;
    .float();
  }

}

.form2 {
  .height(310px);
  .border4;
  background: @whicol;
  .pad4(15px);
  .magbot();
}

.content {
  .pwform {
    min-height: 615px;
    background: @whicol;
    .border4;
    padding-top: 20px;
  }
  .tips {
    text-indent: 30%;
  }
}

.amend {
  background: @oracol;
  .radius();
  color: @whicol;
  .height(40px);
  .display();
  margin: 0 auto;
}

.news-list {
  background: @whicol;
  .border4;
  .pad4(10px);
}

.orabtns {
  .clearfix;
  .magbot();
}

.org-btn {
  background: @oracol;
  padding: 8px 20px;
  color: @whicol;
  .radius();
  float: left;
  .magrt(5px);
  cursor: pointer;
}

.lb {
  .display();
  width: 14px;
  .height(14px);
  .border4;
  box-shadow: 0 0 1px @grecol;
  background: linear-gradient(@whicol, #F5F5F5);
  position: absolute;
  top: 12px;
}

.news-list table {
  width: 100%;
  table-layout: fixed;
}

.news-list tr {
  .height(40px);
  td:first-child, th:first-child {
    width: 10%;
    padding-left: 10px;
    text-align: left;
    position: relative;
  }
  td:nth-child(4n+2), th:nth-child(4n+2) {
    width: 60%;
    text-align: left;
  }
  td:nth-child(4n+3), th:nth-child(4n+3) {
    text-align: center;
  }
  td:nth-child(4n), th:nth-child(4n) {
    text-align: center;
    cursor: pointer;

  }
  td:nth-child(4n) {
    color: @oracol;
  }
  td, th {
    border-bottom: 1px solid @grecol;
  }
  th {
    background: #f2f4f8;
  }
}

input[type=checkbox]:checked + .lb {
  border: 1px solid @oracol;
  background: #fff url(".././user/checkboxIcon.svg") no-repeat 0 0;
  background-size: 12px 14px;
}

//��Ա����
.mem-box1 {
  height: 252px;

  .circle {
    background: #fef7ec;
  }
}

.membox-rt {
  width: auto;
  height: 100%;
  .maglt(282px);
  background: #fef7ec url(".././user/member_introBg.png") no-repeat top right;
  padding-left: 5%;
  overflow: hidden;
  .border4;
  border-left: 0;
  position: relative;

  h2 {
    .fs(30px);
    color: #ac8332;
    .magtop(40px);
  }
  h3 {
    .fs(20px);
    color: #ac8332;
    .magtop(30px);
  }

}

.membox-rt > p {
  width: 300px;
  margin-top: 30px;
  line-height: 1.7;
}

.mem-box2 {
  width: 100%;
  .height(517px);
  background: @whicol;
  .border4;

  .pad4(15px);
}

.memlist {
  margin: 0 50px;
  padding: 10px 0 20px;
  display: flex;
  flex-flow: row nowrap;
  li {
    text-align: center;
    flex: 1;
    span {
      color: @oracol;
      font-weight: bold;
    }
  }
  img {
    margin: 10px 0;
  }
  h3 {
    font-weight: bold;
    margin: 10px 0;
    .fs(15px);
  }

  p {
    line-height: 1.8;
  }
}

.memlist1 {
  border-bottom: 1px dashed @grecol;
}

[class^=mem-box] {
  .magtop();
}

.box {
  .border4;
  background: @whicol;
  .pad4(15px);
}

.mem-box3 {
  .box;
  ul {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    .magtop(10px);
    a {
      .display();
      width: 60%;
      position: absolute;
      right: 5%;
      line-height: 30px;
      top: 25px;
      font-size: 15px;
      &:hover {
        text-decoration: none;
      }
    }
    em {
      color: @oracol;
      .fs(24px);
      font-style: normal;
    }
  }

  li {
    width: 49%;
    .height(177px);
    position: relative;

    &:first-child {
      background: url(".././user/member-cz.png") no-repeat 0 0;
      background-size: 100% 100%;
    }
    &:last-child {
      background: url(".././user/member-content.png") no-repeat 0 0;
      background-size: 100% 100%;
    }
    p {
      &:first-child {
        .fs(20px);
        line-height: 30px;
      }
      &:last-child {
        .fs(15px);
      }
      .maglt(40%);
      .magtop();
    }
  }
}

.mem-box4 {
  .box;

}

.renew-info {
  .height(170px);
  background: #E0EEEE;
  .magtop(15px);
  p {
    .fs(18px);
    width: 100%;
    position: relative;
    padding-left: 20%;
    line-height: 2;
    top: 40px;
  }
}

//welfare
.welfarebox-rt {
  background: #fef7ec !important;
}

.welfarebox2 {
  .box;
  .magtop();
}

.active {
  color: @oracol;
  border-bottom: 2px solid @oracol;
}

.welfare-cap {
  .height(40px);
  line-height: 40px;
  border-bottom: 1px solid @grecol;
  a {
    height: 100%;
    font-weight: bold;
    .display(inline-block);
    padding: 0 50px;
    .magbot(-1px);
    &:hover {
      .active;
      text-decoration: none;

    }
  }
}

.welfare-list {
  min-height: 700px;
  .magtop(10px);
  ul {
    .clearfix;
    .display(none);
    &:first-child {
      z-index: 2;
    }
    background: @whicol;
  }
  li {
    .float();
    width: 24.25%;
    .magrt(1%);
    .magtop(10px);
    &:nth-child(4n) {
      .magrt(0);

    }
    .border4;
    img {
      width: 100%;
    }
    a {
      &:hover {
        text-decoration: none;
      }
    }
  }

}

.card-welfare {
  em, span {
    .display();

    text-align: center;

  }
  em {
    background: #fa4556;
    color: @whicol;
    margin: 10px auto;
    width: 90%;
    .pad4(10px);
  }
  span {
    width: 100%;
    border-bottom: 1px solid @grecol;
    .fs(14px);
    padding: 10px 0;
  }
}

.ul-block {
  .display() !important;
}

.fruit-welfare {
  position: relative;
  padding-bottom: 200px;
  .click {
    .display();
    width: 300px;
    .height(60px);
    background: #fa4556;
    .radius();

    text-align: center;
    line-height: 60px;

    position: absolute;
    bottom: 70px;
    left: 50%;
    .maglt(-150px);
    a {
      .fs(28px);
      position: relative;
      color: @whicol;

    }
  }

  span {
    .display();
    border-bottom: 1px solid @grecol;
    width: 100%;
    text-align: center;
    padding: 10px 0;
  }
  i {
    .display();
    padding: 10px 0;
    text-align: center;
    border-bottom: 1px solid @grecol;
  }
  em {
    .display();
    width: 190px;
    .height(38px);
    line-height: 38px;
    margin: 10px auto;
    text-align: center;
    color: @whicol;
    background: url(".././user/q_bg.jpg") no-repeat center center;
  }
}

.fruit-welfare li {
  position: relative;

}

.WeChat {
  width: 100%;
  .height(66%);
  background: rgba(0, 0, 0, .3) url(".././user/e1.jpg") no-repeat center center;
  background-size: 80%;
  position: absolute;
  .display(none);
}

//software
.softlist {
  .box;
  .magtop();
  padding-bottom: 50px;
  ul {
    .clearfix;
    .magtop(40px);
  }
  li {
    background: rgba(237, 237, 237, .5);
    width: 19.2%;
    .float();
    .height(100px);
    .magrt(1%);
    text-align: center;
    line-height: 100px;
    &:last-child {
      .magrt(0);
    }
    .border4;
    position: relative;
    img {
      vertical-align: middle;
      width: 80%;
    }
  }
}

.two-a {
  width: 100%;
  opacity: 0;
  .height(30px);
  line-height: 30px;
  color: @whicol;
  background: rgba(0, 0, 0, .6);
  position: absolute;
  bottom: 0;
  a {
    padding: 0 10px;
    color: @whicol;
  }
}

.orange-a, .time-a {
  width: 100%;
  .height(100%);
  text-align: center;
  color: @whicol;
  position: absolute;
  top: 0;
  line-height: 2;
  padding-top: 20px;
  .fs(16px);
  opacity: 0;
}

.orange-a {
  background: rgba(255, 130, 0, .7);
}

.time-a {
  background: rgba(0, 0, 0, .7);
  padding-top: 40px;
  span {
    padding: 7px 30px;
    .radius(20px);
    background: @oracol;
    color: @whicol;
  }
}

@keyframes time-ani {
  0% {
    opacity: 0;
    top: 20px;
  }
  100% {
    opacity: 1;
    top: 0;
  }
}
@keyframes two-ani {
  0% {
    opacity: 0;
    bottom: -20px;
  }
  100% {
    opacity: 1;
    bottom: 0;
  }
}
.softlist li:hover .samea{
  animation: time-ani 1s forwards;
}
.softlist li:hover .two-a{
  animation: two-ani 1s forwards;
}
//service
.ad{
  .display();
  width: 100%;
  .height(90px);
  background: url(".././user/cms577f944735710.jpg") no-repeat 0 0;
  background-size: 100% 100%;
}
.servicelist{
  .box;
  min-height: 800px;
  .magtop();
  padding-top: 40px;
  table{
    tr{
      height: 40px;
      text-align: center;
    }
    width: 100%;

  }
  td{
    border-bottom: 1px solid @grecol;
  }
  th{
    background: @grecol;
    font-weight: bold;
  }
}